<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" />
    <title>XEM & ZFC</title>
    <meta name="description" content="XEM & ZFC" />
    <meta name="keywords" content="xem,xmt,520,love" />
    <link rel="stylesheet" type="text/css" th:href="@{/css/xem/lovexhj.css}" />
    <link rel="stylesheet" th:href="@{/css/xem/swiper.css}" />
    <link rel="stylesheet" type="text/css" th:href="@{/css/xem/FiraCode.css}" />
</head>
<body>
<!-- 标题板块 -->
<div class="title">
    <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/bg1.gif" alt="bgGif" />
    <p id="tqyxhj"></p>
</div>


<!-- 分页2 - 时间轴 -->
<div class="page page2">
    <div class="swiper-container swiper-container-lovexhj2">
        <div class="swiper-wrapper">
            <div class="swiper-slide" th:each="item : ${resourceList}">
                <div class="page2-box">
                    <img th:src="${item.resourcePath}" alt="page2-1" />
                    <p>
                        <a th:href="${'/detail?parent='+item.id}">
                            <b>[[${item.title}]]</b>
                        </a>
                    </p>
                    <p th:text="${#temporals.format(item.createTime, 'yyyy-MM-dd')}"></p>
                    <p th:utext="${item.subheading}"></p>
                </div>
            </div>
        </div>
        <div class="swiper-pagination swiper-pagination-lovexhj2"></div>
    </div>
</div>


<!-- 分页4 - 结尾 -->
<div class="page page4">
    <div class="page4-box">
        <div class="page4-img">
            <div class="swiper-container swiper-container-lovexhj3">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-1.png"
                             alt="page-4-1" />
                    </div>
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-2.jpg"
                             alt="page-4-2" />
                    </div>
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-3.jpg"
                             alt="page-4-3" />
                    </div>
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-4.jpg"
                             alt="page-4-4" />
                    </div>
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-5.jpg"
                             alt="page-4-5" />
                    </div>
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-6.jpg"
                             alt="page-4-6" />
                    </div>
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-7.jpg"
                             alt="page-4-7" />
                    </div>
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-8.jpg"
                             alt="page-4-8" />
                    </div>
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-9.jpg"
                             alt="page-4-9" />
                    </div>
                    <div class="swiper-slide">
                        <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/page-4-10.jpg"
                             alt="page-4-10" />
                    </div>
                </div>
                <div class="swiper-button-prev swiper-button-prev-lovexhj3"></div>
                <div class="swiper-button-next swiper-button-next-lovexhj3"></div>
            </div>
        </div>
        <div class="page4-text">
            <h1>Send To Future</h1>
            <p>有你在的每一天都如糖果一样甜</p>
            <!-- <a href="https://blog.lovexhj.cn/" class="blog">进入我们的Blog</a> -->
        </div>
    </div>

    <div class="footer">
        <div class="footerBox">
            <p>
                &copy; 2020
                <a href="https://love.n0ts.top">XEM && ZFC</a>
            </p>
        </div>
    </div>
</div>

<div class="xhjIsPig">
    <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/pig1.gif" alt="pig1" class="pig1" />
    <img src="https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/pig2.gif" alt="pig2" class="pig2" />
</div>

<!-- js加载 -->
<script th:src="@{/js/xem/wow.js}"></script>
<script th:src="@{/js/xem/typeit.min.js}"></script>
<script th:src="@{/js/xem/swiper-3.4.2.min.js}"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.0/jquery.js"></script>
<script th:src="@{/js/xem/xem.js}"></script>
<script th:src="@{/js/xem/su.js}"></script>

<script type="text/javascript">
    (function() {
        new WOW().init();
        $("body").wpSuperSnow({
            flakes: ["https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/004.png",
                "https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/003.png",
                "https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/002.png",
                "https://n0tssss.oss-cn-shanghai.aliyuncs.com/lovexhj/index/images/001.png"
            ],
            totalFlakes: "100",
            zIndex: "999999",
            maxSize: "30",
            maxDuration: "20",
            useFlakeTrans: false
        });
    })();
</script>
</body>
</html>

